<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>随机选择器</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="renderer" content="webkit"><!--360默认为极速模式打开-->
    <!--坑爹的IE兼容-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
    <script src="http://libs.baidu.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
    <link href="http://libs.baidu.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="Fourth.css">
</head>
<body style="background-color: #d1d3d4">
<div align="center">
    <div class="M1 container" >
        <div class="row">
            <h1 style="margin-top: -20px;color: #00006a;">我要变形啦！</h1>
            <div class="M2 col-md-4">
                <h3>输入内容</h3>
                <div style="-moz-opacity:0.6;opacity: 0.6;float: right;">
                    <textarea name="text" id="in" cols="20" rows="11" class="T1"></textarea>
                </div>
            </div>
            <div class="col-md-4" align="center" style="padding-right: 280px;padding-top: 100px">
                <ul>
                    <li><input type="button" value="随机抽取" class="d1" onclick=""/></li>
                    <li><input type="button" value="随机排序" class="d1" onclick="btn()"/></li>
                    <li><input type="button" id="clear" value="重置" class="d1"/></li>
                </ul>
            </div>
            <div class="M3 col-md-4">
                <h3 style="margin-top: -170px;margin-left: 10px">输出结果</h3>
                <div style="-moz-opacity:0.6;opacity: 0.6;float: right;">
                       <textarea name="text" id="out" cols="20" rows="11" class="T2">
                       </textarea>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    $("#clear").click(function (){
        $("#in").val('');
    });
</script>
<script>
    var btn=function(){
        var In=document.getElementById('in').value;
           var strArray=Array();
        strArray=In.split(' ');
        var L=strArray.length;
        $("#out").empty();
        for(i=0;i<L;i++){
            var n;
            n=Math.floor(Math.random()*(strArray.length));
            $("#out").append((i+1)+"."+strArray[n]);
            strArray.splice(n,1);
        }
    }
</script>
